<template>
	<view>
		<view class="relative w-1 fl-c">
			<swiper class="swiper" :autoplay="true" :interval="5000" :duration="500" circular @change="changeBanner">
				<swiper-item v-for="(item,index) in info.images" :key="index">
					<block v-if="!checkTv(item) && platform == 0">
						<image :src="baseUrl.cdnurl+item" mode="aspectFill" class="w-1 h-1"></image>
					</block>
					<block v-else-if="!checkTv(item) && platform == 1">
						<image :src="item" mode="aspectFill" class="w-1 h-1"></image>
					</block>
					<block v-else-if="checkTv(item) && platform == 0">
						<video :src="baseUrl.cdnurl+item" class="w-1 h-1"></video>
					</block>
					<block v-else>
						<video :src="item" class="w-1 h-1"></video>
					</block>
				</swiper-item>
			</swiper>
			<view class="w-1 fr-c dots fm-ali">
				<text>{{curbanner+1}}/{{info.images.length}}</text>
			</view>
		</view>

		<view class="w-1 fl-s-s" style="padding: 28rpx 32rpx; background: #FFFFFF;">
			<view class="fr-b-c w-1">
				<view class="fr-s-c fm-ali" style="color: #FA360A; align-items: baseline;">
					<text class="fs-28">￥</text>
					<text class="fs-48">{{info.price}}</text>
					
				</view>
				
			</view>
			<text class="fs-32 c-00 fm-ali" style="margin-top: 15rpx;">{{products.title}}</text>
			<view class="w-1 fr-b-c c-99 fm-ali fs-24" style="margin-top: 28rpx;">
				<text>赠送积分:{{info.integral || 0}}</text>
				<text>快递费:￥{{info.freight.price}}</text>
				<text>销量:{{info.sales}}</text>
			</view>
		</view>
		<u-gap height="12" bg-color="#f4f4f4"></u-gap>
		<block v-if="choosed">
			<view class="fr-b-c p-r-30" @click="chooseShow(0)" style="height: 75rpx; background: #FFFFFF;">
				<view class="fr-s-c">
					<text class="fs-28 c-00 fm-ali">选择</text>
					<text class="m-l-40 flex-1 text-line-1 c-99 fs-28 fm-ali">{{choosed}}</text>
				</view>
				<image src="/static/images/user/right_arr_icon.png" style="width: 11rpx; height: 16rpx;"></image>
			</view>
			<u-gap height="12" bg-color="#f4f4f4"></u-gap>
		</block>
		<view class="dianpu" v-if="info.shop_goods">
			<view class="dianpu_left">
				<image :src="baseUrl.cdnurl+info.shop_goods.avatar" class="dianpu_left_img" mode=""></image>
				<view class="dianpu_left_title">
					{{info.shop_goods.shopname}}
				</view>
			</view>
			<view class="dianpu_right" @click="toMerchantMerchandise">
				<view class="dianpu_right-text">
					进入店铺
				</view>
				<image src="/static/images/home/Subtract@2x.png" class="dianpu_right_img" mode=""></image>
			</view>
		</view>
		<!-- 评论部分 -->
		<view class="fl-s-s" style="padding: 28rpx 32rpx; background: #FFFFFF;" v-if="products.evaluate_first">
			<view class="fr-b-c fm-ali w-1">
				<view class="fr-s-c">
					<image src="/static/images/home/goods_detail_comment.png" style="width: 23rpx; height: 23rpx;">
					</image>
					<text class="m-l-10 fs-28 c-00">评价{{products.evaluate_total}}</text>
				</view>
				<view class="fr-s-c" @click="toCommentList">
					<text class="fs-28 c-99" style="margin-right: 6rpx;">好评率{{products.favorable_rate}}%</text>
					<image src="/static/images/user/right_arr_icon.png" style="width: 11rpx; height: 16rpx;"></image>
				</view>
			</view>
			<!-- 评论标签 -->
			<view class="fr-s-s w-1 m-t-30" style="background: #FFFFFF; flex-wrap: wrap;">
				<view class="label-item m-r-20 m-b-20 fr-c" v-for="(item,index) in labelTabs" :key="index">
					{{item.text}}({{item.num}})
				</view>
			</view>
			<view class="w-1 fl-s-s">
				<view class="comment-item w-1 fl-s-s" @click="toComment">
					<!-- 头像 星级 时间 -->
					<view class="fr-s-c w-1">
						<image :src="products.evaluate_first.avatar" mode="aspectFill" class="circle"
							style="width: 56rpx; height: 56rpx;"></image>
						<view class="flex-1 fl-c-s m-l-20">
							<view class="fr-b-c w-1 fm-ali">
								<text class="fs-20 c-66">{{products.evaluate_first.nickname}}</text>
								<text class="fs-22 c-99">{{products.evaluate_first.creattime}}</text>
							</view>
							<view class="fr-s-c" style="margin-top: 5rpx;">
								<image v-for="item in products.evaluate_first.star_level" :key="this" class="m-r-10"
									src="/static/images/home/comment_stars.png" style="width: 19rpx; height: 19rpx;">
								</image>
								<image v-for="item in (5-products.evaluate_first.star_level)" :key="this" class="m-r-10"
									src="/static/images/home/comment_star.png" style="width: 19rpx; height: 19rpx;">
								</image>
							</view>
						</view>
					</view>
					<!-- 文字内容 -->
					<text style="word-break: break-all;"
						class="m-t-30 fs-26 c-66 fm-ali">{{products.evaluate_first.content}}</text>
					<!-- 图片 -->
					<view class="fr-s-s w-1 m-t-30" style="flex-wrap: wrap;">
						<image :src="item" v-for="(item,index) in products.evaluate_first.imgs" :key="index"
							mode="aspectFill" class="comment-image"></image>
					</view>
					<!-- 回复区 -->
					<view class="reply-box w-1 m-t-20" v-if="products.evaluate_first.replay.length">
						<view class="fr-s-s" v-for="(item,index) in products.evaluate_first.replay" :key="index">
							<text class="c-33 fm-ali fs-24">{{item.user.nickname}}回复：<text
									class="c-99 fm-ali fs-24">{{item.content}}</text></text>
						</view>
					</view>
				</view>
			</view>
		</view>
		<u-gap height="12" bg-color="#f4f4f4"></u-gap>
		
		<u-gap height="12" bg-color="#f4f4f4" v-if="mch_info"></u-gap>
		<!-- 详情 -->
		<view class="fl-s-s" style="padding: 28rpx 32rpx; background: #FFFFFF;">
			<view class="fr-s-c">
				<image src="/static/images/home/intro_goods_detail.png" style="width: 22rpx; height: 25rpx;"></image>
				<text class="m-l-10 fs-28 c-00 fm-ali">商品介绍</text>
			</view>
			<u-parse class="m-t-30" :html="info.content"></u-parse>
		</view>
		<!-- 底部按钮 -->
		<view class="iphonex" style="background: #FFFFFF;">
			<view class="w-1 fr-b-c p-r-30" style="height: 104rpx;">
				
				<view class="new_icon">
					<view class="new_icon_icon_view"
						@tap="toChat(info.shop_id, { id: info.id, title: info.title, image: info.image, price: info.price })">
						<image class="icon_shop" style="width: 20px;" src="/static/images/home/kefu.png" mode="widthFix"></image>
						<view class="new_icon_icon_text">
							客服
						</view>
					</view>
					<view class="new_icon_icon_view" @tap="go_ShoppingCart">
						<view class="cu-tag badge" v-if="cart.cartnum > 0">{{ cart.cartnum }}</view>
						<image class="icon_shop" style="width: 20px;" src="/static/images/home/cart.png" mode="widthFix"></image>
						<view class="new_icon_icon_text">
							购物车
						</view>
					</view>
				</view>
				<view class="fr-c">
					<view class="add-cart-btn fr-c" @click="dealAddcar">加入购物车</view>
					<view class="buy-btn fr-c" @click="toPurchase">立即购买</view>
				</view>
			</view>
		</view>
		<u-popup closeable border-radius="24" safe-area-inset-bottom v-model="show" :closeable="false" mode="bottom">
			<view class="w-1" style="height: 1074rpx; background-color: transparent; padding-top: 90rpx;">
				<view class="fl-s-s relative w-1"
					style="padding: 28rpx 32rpx; height: 974rpx; background: #FFFFFF; border-radius: 24rpx;">
					<view class="fr-s-s relative" style="height: 132rpx; width: 622rpx;">
						<image :src="sku.thumbnail" class="relative" mode="aspectFill" 
							v-if="platform == 1"
							style="border:4rpx solid #F4F4F4; z-index: 999; margin-top: -90rpx;  width: 212rpx; height: 212rpx;border-radius: 12rpx;">
						</image>
						<image :src="baseUrl.cdnurl+sku.thumbnail" class="relative" mode="aspectFill"
							v-else
							style="border:4rpx solid #F4F4F4; z-index: 999; margin-top: -90rpx;  width: 212rpx; height: 212rpx;border-radius: 12rpx;">
						</image>
						
						<view class="flex-1 fl-s-s fm-ali m-l-20">
							<view class="fr-s-c fm-ali" style="color: #FA360A; align-items: baseline;">
								<text class="fs-24">￥</text>
								<text class="fs-36">{{price || info.price}}</text>
								<!-- <text class="fs-20">.{{goodsPrice | pointsPrice(1)}}</text> -->
							</view>
							<text class="text-line-2 c-66 fs-24">【已选】{{choosed}}，数量{{value}}
								<text v-if="stock">,库存{{stock}}</text>
							</text>
						</view>
					</view>
					<image src="/static/images/user/close_pup.png" @click="show=false" class="absolute"
						style="right: 32rpx; top: 32rpx; height: 22rpx; width: 22rpx;"></image>
					<scroll-view scroll-y class="w-1 m-t-50" style="height: 520rpx; margin-top: 48rpx;">
						<view class="fl-s-s fm-ali" v-for="(item,index) in info.spu" :key="index">
							<text class="c-33 fs-28">{{item.name}}</text>
							<view class="fr-s-s w-1" style="background: #FFFFFF; flex-wrap: wrap;">
								<view @click="changeLabel(index,indexs)" class="m-r-20 m-b-20 fr-c"
									:class="items.toggle?'gg-act':'gg-item'" v-for="(items,indexs) in item.item"
									:key="indexs">{{items.name}}</view>
							</view>
						</view>
						
					</scroll-view>
					<view class="fr-b-c fm-ali w-1">
						<text class="c-33 fs-28">数量</text>
						<u-number-box :min="1" :max="Number(stock)" :disabled-input="true" v-model="value"
							@change="valChange" bg-color="transparent"></u-number-box>
					</view>
					<view class="iphonex" style="background: #FFFFFF;">
						<view class="sure-btn fr-c" @click="clickSure">确定</view>
					</view>
				</view>
			</view>
		</u-popup>
		<!-- 视频播放弹窗 -->
		<u-mask :show="videoshow" class="fl-c" @click="videoshow = false">
			<video v-if="videoshow" autoplay style="width: 600rpx; height: 600rpx;" :src="products.video"></video>
		</u-mask>
		
	</view>
</template>

<script>
	import {
		pointsPrice
	} from '@/utils/util.js'
	import config from '@/utils/base.js';
	import {
		mapState,
		mapActions
	} from 'vuex';
	export default {
		data() {
			return {
				list: [],
				labelTabs: [{
					text: '全部评价',
					num: '0'
				}, {
					text: '好评',
					num: '0'
				}, {
					text: '中评',
					num: '0'
				}, {
					text: '差评',
					num: '0'
				}],
				content: '',
				show: false,
				showType: 0, // 0 点击选择弹出 1 加购物车弹出 2 立即购买弹出
				curlabel: 0,
				value: 1,
				scrollTop: 0,
				id: 0, // 商品id
				shouc: 1, // 1 未收藏 2已收藏
				products: '', // 接口返回产品信息
				mygrouparr: [], // 规格数组
				proinfo: '', // 调取规格接口后返回的数据
				info_content: '',
				mch_info: '', // 商家信息
				curbanner: 0,
				videoshow: false,
				info: '',
				baseUrl: config,
				// sku_index: 0,
				spu: [],
				selectshop: {}, //存放最后选中的商品
				stock: '',
				f_index: 0,
				z_index: 0,
				arr:[],
				sku_id:'',
				sku:[],
				platform:'',
				price:'',
				c_father_goods_id:'',
				sku:'',
				
			}
		},
		onLoad(e) {
			console.log(e);
			this.id = e.id || 0
			this.platform = e.platform || 0
			this.c_father_goods_id = e.c_father_goods_id || 0
			this.getInfo()
			// this.getLabel()
			// this.getInfoContent()
		},
		onNavigationBarButtonTap(e) {
			this.shareImage()
		},

		filters: {
			pointsPrice
		},
		// 计算属性
		computed: {
			// 选的规格
			choosed() {
				let mygrouparr = this.mygrouparr
				let arr = []
				mygrouparr.map(item => {
					item.item.map(items => {
						if (items.toggle) {
							arr.push(items.name)
						}
					})
				})
				return arr.join(',')

			},
			// 商品价格
			goodsPrice() {
				if (!this.proinfo) {
					return this.products.price
				} else {
					return this.proinfo.price
				}
			},
			// 总价 合计
			// totalPrice() {
			// 	if (!this.proinfo) {
			// 		return this.products.price * this.value
			// 	} else {
			// 		return this.proinfo.price * this.value
			// 	}
			// },
			// price() {
			// 	if (this.info) {
			// 		if (Object.keys(this.info.sku).length > 0) {
			// 			return (this.value * Number(this.info.sku[this.f_index].price)) + '.00'
			// 		} else {
			// 			return 0
			// 		}
			// 	}
			// },
			...mapState(['cart', 'common'])
		},
		watch: {
			mygrouparr: {
				deep: true, //true为进行深度监听,false为不进行深度监听
				handler(val) {
					// console.log(val, 'nnnnnnnnn');
					let length = val.length
					let arr = []
					val.map(item => {
						item.item.map(items => {
							if (items.toggle) {
								arr.push(items.name)
							}
						})
					})
					// if(arr.length==length){
					// 	// this.getGgInfo(arr.join(','))
					// }
				}
			},

			price(n, o) {
				if (n != o) {
					// 更新一次优惠券
					this.queryCoupon(n);
				}
			}
		},
		methods: {
			checkTv(img){
				 let index = img.indexOf("."); 
				 let type = img.substring(index); //截断"."之前的，得到后缀
				 // console.log(type)
			     if(type!=".mp4"&&type!=".rmvb"&&type!=".avi"&&type!=".ts"){ //根据后缀，判断是否符合视频格式
			        return false
			     }
			},
			async loadStock(sku_id) {
				this.$api.get({
					url: '/wanlshop/product/stock',
					data: {
						sku_id: sku_id
					},
					success: res => {
						// console.log(res)
						this.stock = res.data;
					}
				});
			},
			go_ShoppingCart() {
				uni.switchTab({
					url: '/pages/ShoppingCart/ShoppingCart'
				})
			},
			// 切换banner
			changeBanner({
				detail
			}) {
				let {
					current
				} = detail
				this.curbanner = current
			},
			// // 商品详情上面部分
			// getInfoContent(){
			// 	this.$get({
			// 		url:'/appuser/content'
			// 	}).then(res=>{
			// 		this.info_content = res.data[0].info_content
			// 	})
			// },
			// // 获取评论类型数量
			// getLabel(){
			// 	this.$get({
			// 		url:'/homepage/goodsEvaluate',
			// 		data:{
			// 			pid:this.id
			// 		}
			// 	}).then(res=>{
			// 		const {cha_total,good_total,total,zhong_total} = res.data.info
			// 		let labelTabs = this.labelTabs
			// 		labelTabs[0].num = total
			// 		labelTabs[1].num = good_total
			// 		labelTabs[2].num = zhong_total
			// 		labelTabs[3].num = cha_total
			// 		this.labelTabs = labelTabs
			// 	})
			// },
			async queryCoupon(price) {
				this.$api.post({
					url: '/wanlshop/coupon/query',
					data: {
						shop_id: this.info.shop_id,
						goods_id: this.info.id,
						shop_category_id: this.info.shop_category_id,
						price: price
					},
					success: res => {
						console.log(res)
						// this.info.coupon = res.data;
					}
				});
			},
			toCommentList() {
				uni.navigateTo({
					url: '/pages/Home/GoodsDetail/CommentList/CommentList?id=' + this.id
				})
			},
			// 处理弹出规格框
			chooseShow(n) {
				this.showType = n
				console.log(this.showType)
				this.show = true
			},
			// 点击弹窗中的确定按钮
			clickSure() {
				let length = this.mygrouparr.length
				let arr = []
				this.mygrouparr.map(item => {
					item.item.map(items => {
						if (items.toggle) {
							arr.push(items.name)
						}
					})
				})
				switch (this.showType / 1) {
					case 0:
						// 选择
						this.show = false
						break;
					case 1:
						// 加购物车
						if (arr.length == length) {
							this.addCard(this.id, this.value, this.proinfo.id)
						} else {
							this.$u.toast('请选择对应的规格')
						}
						break;
					case 2:
						// 购买
						if (arr.length == length) {
							// console.log(this.id);
							// console.log(this.proinfo);
							// let buydata = [this.id + '|' + this.proinfo.id + '|' + this.value]
							let goodsData = [{
								goods_id: this.info.id,
								number: this.value,
								sku_id: this.sku_id,
								platform:this.platform
							}];
							if (this.$store.state.user.isLogin) {
								console.log(this.stock)
								if(!this.stock){
									uni.showToast({
										title:'请选择规格',
										icon:'none'
									})
									return false
								}
								if(this.stock <=0){
									uni.showToast({
										title:'商品库存不足，请重新选择',
										icon:'none'
									})
									return false
								}
								if(this.info.goodsact){
									uni.redirectTo({
										url: `/pages/Home/GoodsDetail/EnsureOrder/EnsureOrder?order_type=groups&data=${JSON.stringify(goodsData)}&goodsact=${JSON.stringify(this.info.goodsact)}&platform=${this.platform}`
									});
									return false
								}
								uni.redirectTo({
									url: `/pages/Home/GoodsDetail/EnsureOrder/EnsureOrder?order_type=groups&data=${JSON.stringify(goodsData)}&platform=${this.platform}`
								});
							} else {
								uni.reLaunch({
									url:'/pages/Login/Login'
								})
							}
							
						} else {
							this.$u.toast('请选择对应的规格')
						}
						break;
				}
			},
			// 获取规格信息
			getGgInfo(str) {
				console.log(str);
				this.$get({
					url: '/MainWxapp/doPageGuigeInfo',
					data: {
						id: this.id,
						str
					}
				}).then(res => {
					console.log(res, '+++')
					this.proinfo = res.data.data.proinfo
				})
			},
			// 处理加入购物车
			dealAddcar() {
				if (!uni.getStorageSync('user_id')) {
					uni.navigateTo({
						url: "/pages/Login/Login"
					})
					return
				}
				if (this.products.use_more == 2) {
					// 单规格 直接加购物车  最后一个参数 单规格为-1  多规格为接口返回的
					this.addCard(this.id, 1, -1)
				} else {
					// 多规格
					this.chooseShow(1)
				}
			},
			// 分享商品图片
			shareImage() {
				uni.showLoading({
					title: '请稍等'
				})
				uni.share({
					provider: "weixin",
					scene: "WXSceneSession",
					type: 2,
					imageUrl: this.products.shareimg,
					success: (res) => {
						console.log("success:" + JSON.stringify(res));
					},
					fail: (err) => {
						this.$u.toast('分享失败')
						console.log("fail:" + JSON.stringify(err));
					},
					complete: () => {
						uni.hideLoading()
					}
				});
			},
			// 加入购物车
			addCard() {
				if (this.$store.state.user.isLogin) {
					console.log(this.stock)
					if(!this.stock){
						uni.showToast({
							title:'请选择规格',
							icon:'none'
						})
						return false
					}
					if(this.stock <=0){
						uni.showToast({
							title:'商品库存不足，请重新选择',
							icon:'none'
						})
						return false
					}
					this.show = false
					this.$store.dispatch('cart/add', {
						shop_id: this.info.shop_id,
						shop_name: this.info.shop_goods.shopname,
						goods_id: this.info.id,
						title: this.info.title,
						number: this.value,
						image: this.info.image,
						sku: this.sku,
						sku_id: this.sku_id,
						sum: this.$wanlshop.bcmul(this.sku.price, this.value)
					});
					this.$wanlshop.msg('已加购物车');
					// uni.redirectTo({
					// 	url: `/pages/Home/GoodsDetail/EnsureOrder/EnsureOrder?order_type=groups&data=${JSON.stringify(goodsData)}`
					// });
				} else {
					uni.reLaunch({
						url:'/pages/Login/Login'
					})
				}
				
			},
			// 收藏 取消收藏
			opCollect() {
				if (!uni.getStorageSync('user_id')) {
					uni.navigateTo({
						url: "/pages/Login/Login"
					})
					return
				}
				this.$post({
					url: '/Wxapps/doPageCollect',
					data: {
						types: 'showProMore',
						id: this.id
					}
				}).then(res => {
					console.log(res, '+++')
					this.shouc = this.shouc == 1 ? 2 : 1
					this.$u.toast(res.msg)
				})
			},
			// 获取商品详情
			getInfo() {
				let that = this
				that.$get({
					url: '/wanlshop/product/goods',
					data: {
						id: that.id,
						platform:that.platform,
						c_father_goods_id: that.c_father_goods_id,
					}
				}).then(res => {
					that.info = res.data
					this.price = that.info.sku[this.f_index].price
					if (that.info.spu) {
						for (let i in that.info.spu) {
							for (let h in that.info.spu[i].item) {
								that.$set(that.info.spu[i].item[h], 'toggle', false)
							}
						}
					}

				})

			},
			changeLabel(index, indexs) {
				if(this.info.sku.length <=0){
					uni.showToast({
						title:'本商品没有库存了',
						icon:'none'
					})
					return false
				}
				this.arr = []
				for(let i in this.info.spu[index].item){
					this.$set(this.info.spu[index].item[i],'toggle',false)
				}
				this.$set(this.info.spu[index].item[indexs],'toggle',true)
				
				for(let h in this.info.spu){
					for(let j in this.info.spu[h].item){
						if(this.info.spu[h].item[j].toggle == true){
							this.arr.push(this.info.spu[h].item[j].name)
						}
					}
				}
				console.log(this.arr.join(','))
				if(this.arr.length  == this.info.sku[0].difference.length){
					for(let item of this.info.sku){
						if(item.difference.join(',') == this.arr.join(',')){
							this.loadStock(item.id)
							this.sku = item
							console.log(this.sku)
							this.sku_id = item.id
							this.price =  item.price
						}
					}
				}
				
				
				
				this.mygrouparr = this.info.spu
			},
			// 去评论
			toComment() {
				let item = encodeURIComponent(JSON.stringify(this.products.evaluate_first))
				uni.navigateTo({
					url: '/pages/Home/GoodsDetail/Comment/ReplyComments/ReplyComments?info=' + item
				})
			},
			valChange(e) {
				console.log('当前值为: ' + e.value)
			},
			toPurchase() {
				if (!uni.getStorageSync('user_id')) {
					uni.navigateTo({
						url: "/pages/Login/Login"
					})
					return
				}
				if (this.products.use_more == 2) {
					// 单规格 直接加购物车  最后一个参数 单规格为-1  多规格为接口返回的
					// this.addCard(this.id,1,-1)
					let buydata = [this.id + '|' + '-1' + '|' + 1]
					uni.navigateTo({
						url: '/pages/Home/GoodsDetail/EnsureOrder/EnsureOrder?buydata=' + encodeURIComponent(JSON
							.stringify(buydata))
					})
				} else {
					// 多规格
					this.chooseShow(2)
				}
				this.queryCoupon(this.info.price)
			},
			toMerchantMerchandise() {
				uni.navigateTo({
					url: '/pages/Home/MerchantDetails/MerchantDetails?shoop_id=' + this.info.shop_id 
				})
			},
			// 查看商品视频
			toPlay() {
				// uni.navigateTo({
				// 	url:"/pages/Home/LivingList/LivingDetail/LivingDetail?src="+encodeURIComponent(this.products.video)
				// })
				this.videoshow = true
			}
		}
	}
</script>

<style>
	page {
		padding-bottom: 120rpx;
		background: #f4f4f4;
	}
	.badge{
		position: absolute;
		top:-10rpx;
		right: 10rpx;
		z-index: 9;
	}
	>>>.u-indicator-item-number {
		width: 108rpx;
		height: 50rpx;
		background: rgba(0, 0, 0, 0.3);
		border-radius: 25rpx;
		font-size: 28rpx;
		font-family: Alibaba;
		color: #FFFFFF;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	>>>.u-numberbox {
		border: 2rpx solid #EEEEEE !important;
		width: 130rpx !important;
		height: 42rpx !important;
		border-radius: 6rpx !important;
		font-family: Alibaba !important;
	}

	>>>.u-number-input {
		font-family: Alibaba;
		font-size: 22rpx;
		color: #000000;
		width: 46rpx !important;
		height: 42rpx !important;
		margin: 0 !important;
		border: none;
		border-radius: 0;
		border-left: 2rpx solid #EEEEEE;
		border-right: 2rpx solid #EEEEEE;
	}

	>>>.u-icon-minus {
		width: 42rpx !important;
		height: 42rpx !important;
		color: #C0C0C0 !important;
	}

	>>>.u-icon-plus {
		width: 42rpx !important;
		height: 42rpx !important;
		color: #C0C0C0 !important;
	}

	>>>.u-drawer-bottom {
		background-color: transparent !important;
	}

	.cou-item {
		padding: 0 20rpx;
		font-size: 24rpx;
		font-family: Alibaba;
		color: #FA360A;
		height: 54rpx;
	}

	.label-item {
		padding: 0 22rpx;
		height: 60rpx;
		background: rgba(250, 54, 10, 0.1);
		border-radius: 32rpx;
		font-size: 24rpx;
		font-family: Alibaba;
		color: #666666;
	}

	.comment-item {
		padding: 28rpx 0;
		border-bottom: 2rpx solid #F4F4F4;
	}

	.comment-image {
		width: 164rpx;
		height: 166rpx;
		border-radius: 8rpx;
		margin-right: 10rpx;
		margin-bottom: 10rpx;
	}

	.reply-box {
		background: #F4F4F4;
		border-radius: 16rpx;
		padding: 28rpx 32rpx;
	}

	.add-cart-btn {
		width: 192rpx;
		height: 68rpx;
		background: #FA8B0A;
		border-radius: 34rpx;
		font-size: 26rpx;
		font-family: Alibaba;
		color: #FFFFFF;
	}

	.buy-btn {
		width: 192rpx;
		height: 68rpx;
		background: #FA360A;
		box-shadow: 0rpx 6rpx 3r2px 2rpx rgba(250, 74, 20, 0.58);
		border-radius: 34rpx;
		font-size: 26rpx;
		font-family: Alibaba;
		color: #FFFFFF;
		margin-left: 14rpx;
	}

	.label-item {
		padding: 0 22rpx;
		height: 60rpx;
		background: rgba(250, 54, 10, 0.1);
		border-radius: 32rpx;
		font-size: 24rpx;
		font-family: Alibaba;
		color: #666666;
	}

	.item-act {
		padding: 0 22rpx;
		height: 60rpx;
		background: rgba(250, 54, 10, 0.1);
		border-radius: 32rpx;
		border: 2rpx solid #FA360A;
		font-size: 24rpx;
		font-family: Alibaba;
		color: #FA360A;
	}

	.gg-act {
		padding: 0 32rpx;
		height: 68rpx;
		background: #FA360A;
		border-radius: 8rpx;
		font-size: 28rpx;
		font-family: Alibaba;
		color: #FFFFFF;
		margin-top: 28rpx;
		margin-right: 28rpx;
	}

	.gg-item {
		margin-top: 28rpx;
		margin-right: 28rpx;
		padding: 0 32rpx;
		height: 68rpx;
		background: rgba(0, 0, 0, 0.05);
		border-radius: 8rpx;
		font-size: 28rpx;
		font-family: Alibaba;
		color: #666666;
	}

	.sure-btn {
		width: 686rpx;
		height: 100rpx;
		background: linear-gradient(246deg, #FA360A 0%, #FA8C0A 100%);
		box-shadow: 0rpx 6rpx 32rpx 2rpx rgba(250, 74, 20, 0.58);
		border-radius: 50rpx;
		font-size: 32rpx;
		font-family: Alibaba;
		color: #FFFFFF;
		margin: auto;
		margin-bottom: 30rpx;
	}



	.swiper {
		height: 750rpx;
		width: 750rpx;
		overflow: hidden;
	}

	.dots {
		position: absolute;
		right: 20rpx;
		bottom: 20rpx;
		width: 70rpx;
		height: 36rpx;
		background: rgba(0, 0, 0, 0.5);
		font-size: 22rpx;
		color: #FFFFFF;
		border-radius: 40rpx;
	}

	.play-btn {
		width: 96rpx;
		height: 96rpx;
		border-radius: 50%;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
		z-index: 9;
	}

	.yuanjia {
		font-size: 28rpx;
		font-family: Alibaba PuHuiTi 2.0-55 Regular, Alibaba PuHuiTi 20;
		font-weight: normal;
		color: #999999;
		margin-left: 12rpx;
		text-decoration: line-through;
	}

	.dianpu {
		width: 100%;
		height: 88rpx;
		background: #FFFFFF;
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 0 32rpx;
	}

	.dianpu_left_img {
		width: 34rpx;
		height: 34rpx;
		background-color: aliceblue;
		border-radius: 50%;
		margin-right: 16rpx;
	}

	.dianpu_left {
		display: flex;
		align-items: center;
		font-size: 26rpx;
		font-family: Alibaba PuHuiTi 2.0-65 Medium, Alibaba PuHuiTi 20;
		font-weight: normal;
		color: #333333;
	}

	.dianpu_right {
		display: flex;
		align-items: center;
		font-size: 28rpx;
		font-family: Alibaba PuHuiTi 2.0-55 Regular, Alibaba PuHuiTi 20;
		font-weight: normal;
		color: #333333;
	}

	.dianpu_right_img {
		width: 20rpx;
		height: 20rpx;
		margin-left: 12rpx;
	}

	.new_icon {
		display: flex;
		align-items: center;
	}

	.new_icon_icon_view {
		width: 100rpx;
		text-align: center;
		margin-right: 20rpx;
		position: relative;
	}

	.new_icon_icon {
		font-size: 40rpx;
	}

	.new_icon_icon_view {
		font-size: 20rpx;
		font-family: Alibaba PuHuiTi 2.0-55 Regular, Alibaba PuHuiTi 20;
		font-weight: normal;
		color: #262626;
	}
	.icon_shop{
		width: 40rpx;
		height: 40rpx;
	}
</style>